window.addEventListener('popstate',function(e) {
    //当用户点击返回按钮时，需要执行的操作
    showInfo.getShowInfo();
}, false);


//vue请求数据
var showInfo = new Vue({
    el: "#wrapper",
    data: {
        boxes : null,
        websites : null,
        currentBox : null,
        favoriteId : null
    },
    methods: {
        //新增一个书签
        addBookmark : function () {
            let _this = this;
            let favorite = {
                name : $("#nssNameInput").val(),
                img : $("#imgInput").val(),
                url : $("#nssUrlInput").val(),
                boxId : _this.currentBox.id
            };
            if ($.emptyString(favorite.url)){
                layer.alert("网站链接不能为空",{icon : 5})
                return;
            }
            axios.post("/favorite/addFavorite",favorite)
                .then( resp =>{
                    let data = resp.data;
                    //新增成功
                    $.errorAjax(data,()=>{
                        //元素消失
                        $("#nssCancel").trigger("click");
                        //重新渲染
                        _this.getShowInfo();
                    })
                } )
        },
        //获得一个书签
        getOne : function (id) {
            let _this = this;
            $("#add-favorite").trigger("click");
            //获得当前id的收藏信息
            axios.get("/favorite/getOne",{
                params : {
                    id : id
                }
            })
                .then( (resp)=>{
                    let data = resp.data;
                    $("#nssNameInput").val(data.name);
                    $("#imgInput").val(data.img);
                    $("#nssUrlInput").val(data.url);
                    //改为更新状态
                    $("#nssConfirm").data("type","update");
                    _this.favoriteId = id;
                } )
        },
        //删除一个书签
        deleteFavorite : function (id) {
            let _this = this;
            let params = new URLSearchParams();
            params.append("id",id);
            axios.delete("/favorite/deleteFavorite",{data:params})
                .then( resp => {
                    $.errorAjax(resp.data,()=>{
                        //元素消失
                        $("#nssCancel").trigger("click");
                        //重新渲染
                        _this.getShowInfo();
                    })
                } )
        },
        //更新一个书签
        updateFavorite : function () {
            let _this = this;
            //获得输入框中的内容
            let favorite = {
                name : $("#nssNameInput").val(),
                img : $("#imgInput").val(),
                url : $("#nssUrlInput").val(),
                id : _this.favoriteId
            };
            if ($.emptyString(favorite.url)){
                layer.alert("网站链接不能为空",{icon : 5})
                return;
            }
            axios.put("/favorite/updateFavorite",favorite)
                .then( resp =>{
                    let data = resp.data;
                    //新增成功
                    $.errorAjax(data,()=>{
                        //元素消失
                        $("#nssCancel").trigger("click");
                        //重新渲染
                        _this.getShowInfo();
                    })
                } )
        },
        //获得页面需要的展示信息
        getShowInfo : function () {
            //获得boxId
            let urlParam = $.getParameterJson();
            let _this = this;
            axios.get("/favorite/getShowInfo",{
                params : {
                    boxId : urlParam.boxId
                }
            })
            .then( resp => {
                _this.boxes =  resp.data.boxes;
                _this.websites =  resp.data.websites;
                _this.currentBox =  resp.data.currentBox;
            } )
        },
        //点击切换收藏夹
        switchBox : function (boxId) {
            let url = location.href;
            if (url.indexOf("boxId")==-1){
                url = url+"?boxId="+boxId;
            } else{
                url = url.replace(/boxId=[0-9]+/,"boxId="+boxId);
            }
            history.pushState(null,null,url);
            this.getShowInfo();
        }
    },
    created: function() {
        this.getShowInfo();
    }
})